<%--
  Created by IntelliJ IDEA.
  User: Lenovo
  Date: 2020/10/26
  Time: 8:24
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String path = request.getContextPath();
    application.setAttribute("path",path);
%>
<html>
<head>
    <title>员工列表页</title>
    <!-- 引入layui.css--->
    <link rel="stylesheet" href="${path}/layui/css/layui.css">
    <!---引入layui.js-->
    <script src="${path}/layui/layui.js"></script>
</head>
<body>
    <div class="layui-container">
        <table class="layui-table" id="dataTable" lay-filter="tableDemo"></table>
    </div>

</body>
<!--自定义列模板-->
<script type="text/javascript" id="dateDemo">
    {{
        util.toDateString(d.hireDate,'yyyy-MM-dd')
    }}
</script>
<script>
    var util,table,$;

    //渲染表格
    layui.use(['table','jquery','util'],function(){
        table = layui.table;
        $ = layui.jquery;
        util = layui.util;
        var tableIns = table.render({
           //使用 属性：值 的形式，给表格渲染设置数据和形式
           elem : '#dataTable',  //要渲染的表格元素
           url :  '${path}/emp/list',      //数据接口url 异步请求，要求返回的数据为json格式
           cols : [[
               {field: 'empNo',title: '员工列表',width:'11%'},
               {field: 'eName',title: '员工姓名',width:'11%'},
               {field: 'job',title: '工作岗位',width:'22%'},
               {field: 'mgr',title: '经理编号',width:'11%'},
               {field: 'hireDate',title: '入职时间',width:'11%',templet: '#dateDemo'},
               {field: 'sal',title: '工资',width:'11%',sort:true,
                   templet:function(d){  //d代表当前行的整个对象
                        if(d.sal == null){
                            return '￥0';
                        }
                        return '￥' + d.sal;
                   }},
               {field: 'comm',title: '奖金',width:'11%',sort:true,
                   templet:'<span>￥{{d.comm}}</span>'},
               {field: 'deptNo',title: '部门编号',width:'11%'}
           ]],              //设置表头
           page : false,     //不开启分页功能
           method : 'post',
           loading : true //立即加载
       });






    });
</script>
</html>
